<template>
    <div>
        <two-ceil flag="2" @twoceilClick="sortSearchClick"></two-ceil>
        <two-Sort catsId='2' @bigSort="bigSortChange" @miniSort="miniSortChange" @styleSort="styleSortChange" @most="mostDc" @vipYn="vipClick" :activeClass="{bigClass:this.$route.query.id,miniClass:this.$route.query.itemChild}" modeName="SU模型" :searchText="this.$route.query.keys" @sortSearch="sortSearchClick" sortSearch="1" modeUrl="/sumodel" @bigAllMode="sortChange"></two-Sort>
        <div class="wrap">
            <loading v-if="loadingShow" loadingStyle="height:700px;"></loading>
            <mode-list v-else :length="modeListLength" toUrl="ModeInfoSu" :indexMsg="indexMsg" modeType="2" :searchClass="searchClick" :searchText="this.$route.query.keys"></mode-list>
        </div>
        <page :pageItem='pageMsg' @pageChange="getMsg"></page>
    </div>
</template>
<script>
import {mapState,mapMutations,mapGetters,mapActions} from 'vuex';
import loading from '../loading';
import twoCeil from '../twoCeil'
import twoSort from '../twoSort'
import modeList from '../modeList'
import page from '../page'
export default {
    name:"sumodel",
    data(){
        return {
            loadingShow:true,
            bigNum : 0,//大类分类默认
            miniNum : 0,//小类分类默认
            styleNum : 0,//风格分类默认
            modeListLength : '',//显示模块数量
            most:0,//最多收藏、最多下载分类，默认为0
            vipAll:0,//筛选vip  默认全部0
            searchClick:"",//是否搜索
            keyWordsMsg : '草图大师下载_su下载_草图大师模型_su模型下载_SU模型库',//关键词
            titleMsg : '集设网_SU模型下载',//描述
            pageMsg:{
                "data": {
                    "items": {
                        "6": [
                            {
                                "id": 66,
                                "title": "Princess Becker",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 80,
                                "title": "Lawson Ward",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 88,
                                "title": "Mr. Rosario Stroman",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 94,
                                "title": "Brigitte Legros",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 17,
                                "title": "Pansy Hudson V",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 18,
                                "title": "Monserrate O'Conner",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 19,
                                "title": "Reina Hackett Jr.",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 24,
                                "title": "Annetta Jaskolski",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            },
                            {
                                "id": 39,
                                "title": "Ms. Zola Altenwerth",
                                "image": "http://192.168.1.162/imagecache/large/https://img.zcool.cn/community/01cd6f591a7064b5b3086ed43f518f.jpg@1280w_1l_2o_100sh.jpg"
                            }
                        ]
                    }
                },
                "links": {
                    "first": "http://192.168.1.162/api/cat/6/0/0/0/getitems?page=1",
                    "last": "http://192.168.1.162/api/cat/6/0/0/0/getitems?page=1",
                    "prev": null,
                    "next": null
                },
                "meta": {
                    "current_page": 1,
                    "from": 1,
                    "last_page": 1,
                    "path": "http://192.168.1.162/api/cat/6/0/0/0/getitems",
                    "per_page": 16,
                    "to": 9,
                    "total": 9
                },
                "status": "1",
                "code": "success"
            },//翻页数据
            indexMsg : {
                    "items": {
                        "1": [
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            },
                            {
                                "id": '',
                                "title": "",
                                "image": ""
                            }
                        ]
                    }
            }
        }
    },
    components:{
        loading,
        twoCeil,
        twoSort,
        modeList,
        page
        /* twoCeil : resolve => require(["../twoCeil"], resolve),//二级吊顶
        twoSort : resolve => require(["../twoSort"], resolve),//二级分类
        modeList : resolve => require(["../modeList"], resolve),//模块列表
        page : resolve => require(["../page"], resolve)//翻页 */
    },
    methods:{
        sortSearchClick(n){//同页面搜索
        
            this.searchClick = "searchClass";
            this.loadingShow = true;
            var n = n||0;
            axios.get('/cat/2/0/0/0/0/'+n+'/'+this.most+'/'+this.vipAll+'/getitems').then(response => {
                this.indexMsg = response.data.data;
                this.modeListLength = response.data.meta.to;//显示模块数量
                this.pageMsg = response.data;//翻页数据
                this.loadingShow = false;
            });
        },
        ...mapMutations(//mutations中的方法
            ["loginShow","loginClose","loginLoginName","registerLoginName","getItemHome"]
        ),
        getMsg(value){
            this.loadingShow = true;
            let newQuery = JSON.parse(JSON.stringify(this.$route.query))
                    newQuery.page = value;
                    //改变url
                this.$router.push({path:'/sumodel',query:newQuery})
             /* axios.get('/cat/2/'+this.$route.query.catid1+'/'+this.$route.query.catid2+'/'+this.$route.query.style+'/'+this.$route.query.id+'/'+this.$route.query.keys+'/'+this.$route.query.sort+'/'+this.$route.query.vip+'/getitems?'+'page='+value).then(response => {
                this.indexMsg = response.data.data;
                this.modeListLength = response.data.meta.to;//显示模块数量
                this.loadingShow = false;
                this.pageMsg = response.data;//翻页数据
                let newQuery = JSON.parse(JSON.stringify(this.$route.query))
                    newQuery.page = value;
                    //改变url
                this.$router.push({path:'/sumodel',query:newQuery})
            }) */
        },
        bigSortChange(index,msg){//大类发生改变时
            this.bigNum = index;
            // this.loadingShow = true;
            if(index!=0){
                this.sortChange();
            }
            if(!msg){
                msg="";
            }
            this.titleMsg = msg+"SU模型下载_集设网";
            this.keyWordsMsg = msg+"su模型下载_"+msg+"模型参考_SU模型库"
        },
        miniSortChange(index){//小类发生改变时
            this.miniNum = index;
            // this.loadingShow = true;
            if(index!='0'){
                this.sortChange();
            }
        },
        styleSortChange(index){//风格发生改变时
            this.styleNum = index;
            // this.loadingShow = true;
            if(index!='0'){
                this.sortChange();
            }
        },
        mostDc(most){//最多收藏或最多下载时执行的函数
            this.most = most;
            // this.loadingShow = true;
            if(most!='0'){
                this.sortChange();
            }
        },
        vipClick(vip){//显示vip排序
            this.vipAll = vip;
            // this.loadingShow = true;
            if(vip!='0'){
                this.sortChange();
            }
        },
        sortChange(){//分类风格发生改变时重新请求数据
            this.loadingShow = true;
            axios.get('/cat/2/'+this.$route.query.catid1+'/'+this.$route.query.catid2+'/'+this.$route.query.style+'/'+this.$route.query.id+'/'+this.$route.query.keys+'/'+this.$route.query.sort+'/'+this.$route.query.vip+'/getitems?page='+this.$route.query.page).then(response => {
                this.indexMsg = response.data.data;//传递的模块数据
                this.modeListLength = response.data.meta.to;//显示模块数量
                this.pageMsg = response.data;//翻页数据
                this.loadingShow = false;
            })
        },
    },
    computed:{
        ...mapState({//登录的用户信息
            user: state => state.AuthUser
        }),
        mismatchError() {
            return this.bag.has('password:auth') && !this.errors.has('password')
        },
    },
    created (){
        if(this.$route.query.page=="0"){
            if(this.$route.query.itemChild&&this.$route.query.id){//查看更多上侧小分类
                this.bigNum = this.$route.query.id;
                this.miniNum = this.$route.query.itemChild;
                this.sortChange();
            }else if(this.$route.query.id!='0'){//点击查看更多
                this.bigNum = this.$route.query.id;
                this.sortChange();
            }else if(this.$route.query.searchText){
                axios.get('/cat/'+this.$route.query.type+'/'+this.$route.query.catid1+'/'+this.$route.query.catid2+'/'+this.$route.query.style+'/'+this.$route.query.id+'/'+this.$route.query.keys+'/'+this.$route.query.sort+'/'+this.$route.query.vip+'/getitems').then(response => {
                    this.indexMsg = response.data.data;
                    this.modeListLength = response.data.meta.to;//显示模块数量
                    this.pageMsg = response.data;//翻页数据
                    this.loadingShow = false;
                });
            }else{
                axios.get('/cat/'+this.$route.query.type+'/'+this.$route.query.catid1+'/'+this.$route.query.catid2+'/'+this.$route.query.style+'/'+this.$route.query.id+'/'+this.$route.query.keys+'/'+this.$route.query.sort+'/'+this.$route.query.vip+'/getitems').then(response => {
                    this.indexMsg = response.data.data;
                    this.modeListLength = response.data.meta.to;//显示模块数量
                    this.pageMsg = response.data;//翻页数据
                    this.loadingShow = false;
                });
            }
        }
    },
    mounted(){
        document.body.scrollTop = 0;
        document.documentElement.scrollTop = 0;
    },
    metaInfo () {
      return {
        title: this.titleMsg,
        meta: [
            {                 // set meta
                name: 'keyWords',
                content: this.keyWordsMsg
            },
            {                 // set meta
                name: 'description',
                content: '集设网-SU模型下载，优质的室内设计素材下载网站'
            }
        ]
      }
    },

}
</script>
